/**
 * Created by 1 on 2016/12/8.
 */
var tree = document.getElementById("tree");
var menus = document.getElementById("menus");
var searchInput = document.getElementById("search-input");
var searchBtn= document.getElementById("search-btn");
tree.onclick = function (ev) {//折叠打开事件
    var event = ev || window.event;
    var target = event.target;
    var p = tree.getElementsByTagName("p");
    for(var m in p){//重置所有样式
        if(p[m].tagName){
            p[m].style.backgroundColor="";
            p[m].style.border="";
        }
    }
    if (event.target.tagName==("P"||"p")){//js中返回的标签名为大写
        event.target.style.backgroundColor = "rgba(230,220,60,0.7)";
        event.target.style.border = "solid lightgray 2px";
        target = target.parentNode;//将p的父标签li作为目标
    }
    if (target.className == "node"){
        var childs = target.childNodes//获得子节点
        if (childs.length == 1){//空文件夹处理
            if (target.style['skey'] == "on"){
                target.style['list-style-image'] = 'url("file2.jpg")';
                target.style['skey'] = "off";
            }else {
                target.style['list-style-image'] = 'url("file1.jpg")';
                target.style['skey'] = "on";
            }
        }
        for (var node in childs){
            if (childs[node].tagName == "ul" || childs[node].tagName == "UL"){
                if (childs[node].style.display){//
                    childs[node].style.display = "";
                    target.style['list-style-image'] = 'url("file2.jpg")';
                }else {
                    childs[node].style.display = "none";
                    target.style['list-style-image'] = 'url("file1.jpg")';
                }
            }
        }
    }
}
tree.onmouseup= function (ev) {//菜单事件
    var event = ev || window.event;
    var ps = tree.getElementsByTagName("p");
    var p;
    tree.oncontextmenu=function(event){
        event.preventDefault();//阻止鼠标默认事件
    };
    for (var t in ps){
        if (ps[t].tagName){
            ps[t].style.background = "";
            ps[t].style.border = "";
        }
    }
    if(event.button == 2 && event.target.tagName == ("P" || "p")){
        p = event.target;
        event.target.style.backgroundColor = "rgba(230,220,60,0.7)";
        event.target.style.border = "solid lightgray 2px";
        var x = event.clientX + 1;
        var y = event.clientY +  1;
        menus.style.top = y + "px";
        menus.style.left = x + "px";
        menus.style.display = "block";
    }else {
        menus.style.display = "";
        if (p){
            p.style.background = "";
            p.style.border = "";
        }
    }

    menus.onclick = function (e) {
        var e = e || window.event;//右键菜单事件

        if (event.target.tagName == ("P" || "p")){
            switch (e.target.id){
                case "create":
                    menus.style.display = "";
                    event.target.style.backgroundColor = "";
                    event.target.style.border = "";
                    var name = prompt("请输入要添加的文件名","");
                    if(name){
                        var fragment = document.createDocumentFragment();
                        var li = document.createElement("li");
                        var p = document.createElement("p");
                        li.className = "node";
                        p.textContent = name;
                        li.appendChild(p);
                        if (event.target.parentNode.childNodes.length > 1){
                            fragment.appendChild(li);
                            event.target.parentNode.childNodes[2].appendChild(fragment);
                        }else {
                            var ul = document.createElement("ul");
                            ul.appendChild(li);
                            fragment.appendChild(ul);
                            event.target.parentNode.childNodes[1].appendChild(fragment);
                        }
                    }
                    break;
                case "rename":
                    event.target.style.backgroundColor = "";
                    event.target.style.border = "";
                    var name = prompt("请输入文件名","");
                    if (name){
                        event.target.textContent = name;
                    }
                    break;
                case  "delete":
                    menus.style.display = "";
                    event.target.style.backgroundColor = "";
                    event.target.style.border = "";
                    alert("删除:" + event.target.textContent);
                    var parent = event.target.parentNode.parentNode;
                    parent.removeChild(event.target.parentNode);
                    break;
            }
        }
    }
}
searchBtn.onclick = function () {
    if(!searchInput.value){
        alert("请输入查找内容");
        return;
    }else {
        find(searchInput.value);
    }
}
var isFind = 0;//查找标记
function find(value) {
    var root = document.getElementById("root");
    isFind = 0;
    for(var node in root.childNodes){
        if(root.childNodes[node]){
            DFS(root.childNodes[node],value);
        }
    }
}
function DFS(node,value) {//深度优先算法
    if(node.tagName){//判断是否为空的子节点
        //一直往下搜索到p节点然后进行模糊判断
        if(node.tagName == ("P" || "p")) {//判断是否是p标签，需要一直深度到p标签进行判断
            if (node.textContent.indexOf(value) >= 0) {//搜索是否有该节点与其相同的值,大于等于0表示该值存在，模糊查找
                node.style.background = "rgba(200,200,180,80)";
                // console.log(node);
                parent = node.parentNode;
                while (parent.id != "root") {
                    parent.style.display = "";
                    parent = parent.parentNode;
                }
                isFind = 1;
            } else {
                node.style.background = "";
            }
        }
        //深度优先查找
        for (var n in node.childNodes){//上面代码进行匹配，这段代码进行深度搜索
            if (node.childNodes[n].tagName){//若仍然存在标签，即不是空格，则继续进行深度搜索
                console.log(node.childNodes[n]);
                DFS(node.childNodes[n],value);
            }
        }
        //子元素查找完毕则对其同胞元素进行深度搜索
        if(node.nextSibling){//子元素查找完成就查找同辈元素
            DFS(node.nextSibling,value);//同辈元素的深度搜索
        }else {
            return;
        }
    }

}